<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>CSS3答题卡翻页效果</title>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="viewport"
          content="width=device-width,initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no"/>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link href="${pageContext.request.contextPath}/static/css/risk_test.css" rel="stylesheet"/>
</head>

<body style="background-color:#1fc587">

<div class="wrapper">
    <div id="answer" class="card_wrap">
        <c:if test="${!empty list}">
        <c:forEach var="collect" items="${list}" varStatus="i">
        <c:if test="${!empty collect}">
        <!--Q1-->
        <c:choose>
        <c:when test="${i.index+1<4}">
        <div class="card_cont card${i.index+1}">
            </c:when>
            <c:otherwise>
            <div class="card_cont">
                </c:otherwise>
                </c:choose>
                <div class="card">
                    <p class="question"><span>Q${i.index+1}、</span>${collect.choice.info}(${collect.choice.answ})</p>
                    <ul class="select">
                        <li>
                            <input id="q${i.index+1}_1" type="radio" name="r-group-${i.index+1}"
                            <c:if test="${collect.answTag==1}">
                                   checked="checked"
                            </c:if>
                            >
                            <label for="q${i.index+1}_1">${collect.choice.a}</label>
                        </li>
                        <li>
                            <input id="q${i.index+1}_2" type="radio" name="r-group-${i.index+1}"
                            <c:if test="${collect.answTag==2}">
                                   checked="checked"
                            </c:if>
                            >
                            <label for="q${i.index+1}_2">${collect.choice.b}</label>
                        </li>

                        <c:if test="${!empty collect.choice.c}">
                            <li>
                                <input id="q${i.index+1}_3" type="radio" name="r-group-${i.index+1}"
                                <c:if test="${collect.answTag==3}">
                                       checked="checked"
                                </c:if>
                                >
                                <label for="q${i.index+1}_3">${collect.choice.c}</label>
                            </li>
                        </c:if>
                        <c:if test="${!empty collect.choice.d}">
                            <li>
                                <input id="q${i.index+1}_4" type="radio" name="r-group-${i.index+1}"
                                <c:if test="${collect.answTag==4}">
                                       checked="checked"
                                </c:if>
                                >
                                <label for="q${i.index+1}_4">${collect.choice.d}</label>
                            </li>
                        </c:if>
                    </ul>
                    <div class="card_bottom">
                        <c:if test="${i.index+1>1}">
                            <a class="prev">上一题</a>
                        </c:if>
                        <c:if test="${i.index+1<list.size()}">
                            <a class="next">下一题</a>
                        </c:if>
                        <span><b>${i.index+1}</b>/${list.size()}</span></div>
                </div>
            </div>
            </c:if>
            </c:forEach>
            </c:if>

        </div><!--/card_wrap-->

    </div>
</div>
<script src="${pageContext.request.contextPath}/static/js/jquery-1.11.3.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/answer.js"></script>
<script>
    $(function () {
        $("#answer").answerSheet({});
    })

</script>
</body>

</html>
